<template>
	<view id="myChart2" class="chart"></view>
</template>

<script>
	import * as echarts from 'echarts';

	export default {
		name: 'money-back-line',
		props: ['chartD'],
		data() {
			return {}
		},
		methods: {
			drawLine() {
				let myChart = echarts.init(document.getElementById('myChart2'))
				let option = {
					title: { show: false },
					tooltip: { trigger: 'axis' },
					legend: { data: ['回款金额'] },
					xAxis: { data: this.chartD.categories, axisLabel: { rotate: 40 } },
					yAxis: [
						{ name: `金额/元`, type: 'value', splitNumber: 4 }
					],
					grid: [{
						bottom: '16%',
						left: '7%',
						right: '5%'
					}],
					series: [{
						name: '回款金额',
						type: 'line',
						data: this.chartD.series,
						smooth: true,
						itemStyle: { color: '#67C23A' },
						areaStyle: { opacity: 0.4 }
					}]
				}
				myChart.setOption(option)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.chart {
		width: 100%;
		height: 360px;
		background-color: #FFFFFF;
	}
</style>
